<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JSON</title>
    <script>
        // JSON：JavaScript Object Notation，JavaScript 对象表示法
        // JSON 格式的说明：
        // 1、外层符号
        //      {}：定义了一个 JSON 对象
        //      []：定义了一个 JSON 数组
        // 2、JSON 对象
        //      由一系列的键值对组成，键和值之间是冒号，键值对之间是逗号
        //      {key1:value1, key2:value2, key3:value3}
        // 3、JSON 数组
        //      由一系列的值组成，值之间是逗号
        //      [value1, value2, value3]
        // 4、数据类型
        //      key：永远都是字符串类型
        //      value（既指对象的value，又指数组的value）：
        //          基本数据类型
        //          引用类型：对象、数组
        // 5、JSON 格式从理论上来说，可以无限嵌套
        // -------------------
        // JSON 对象举例：
        let jsonObj = {
            name: "tom",
            age: 18,
            sex: "男",
            hobby: ["打球", "看电影", "听歌", {
                name: "张三",
                age: 18,
                sex: "男"
            }],
            address: {
                province: "北京",
                city: "北京",
                info: {
                    street: "朝阳区",
                    number: 100
                }
            }
        };

        // JSON 数组举例：
        // 以下数据如果使用 Java 类型封装，可以设计为：List<Student>
        let jsonArray = [
            {
                stuId: 10,
                stuName: "张三",
                stuAge: 18
            },
            {
                stuId: 20,
                stuName: "李四",
                stuAge: 20
            },
            {
                stuId: 30,
                stuName: "王五",
                stuAge: 22
            }
        ]

        // JSON 和 Java 类型的对应关系
        // JSON 数组：Java List集合
        // JSON 对象：Java Map集合、Java实体类

        // Java 实体类指的是什么？
        // 答：Java 中专门用于封装业务数据的类，例如：员工类（Employee）、部门类（Department）、汽车（Car）、学生类（Student）

        // JSON 格式的应用场景：
        // 1、前端和后端交互过程中，封装数据，作为数据的格式
        // 2、后端应用程序在分布式架构中，各个模块彼此之间互相调用，以 JSON 格式传输数据
        // 3、前端技术中作为配置文件的格式，例如：package.json、webpack.config.js

        // ====================JSON 对象和 JSON 字符串之间互相转换====================
        // 1、创建 JSON 对象
        let student = {
            stuId: 10,
            stuName: "张三",
            stuAge: 18
        };
        console.log(typeof student); // object

        // object 类型可以直接访问它的属性
        console.log(student.stuId);
        console.log(student.stuName);
        console.log(student.stuAge);

        // 2、把上面的 JSON 对象转换为 JSON 字符串
        let jsonStr = JSON.stringify(student);
        console.log(typeof jsonStr) // string

        // string 类型就不能访问对象的属性了
        console.log(jsonStr.stuName);

        // 3、把 JSON 字符串转换成 JSON 对象
        let student2 = JSON.parse(jsonStr);
        console.log(student2.stuId);
        console.log(student2.stuName);
        console.log(student2.stuAge);
    </script>
</head>
<body>

</body>
</html>